/*  header-comment
/*  file   : /Users/allan/Desktop/workSpace/react-hrm-h5/src/modules/hrCenter/statistics/index_backup
/*  author : Allan
/*  date   : 2017-6-4 18:24:50
/*  last   : 2017-10-5 16:27:43
*/
import React, { Component } from "react";
import { WhiteSpace, Icon } from "@ali/ding-ui";
import "./index.less";
// import LineChart from "../../../components/LineChart/";
// import lwp from "../../../utils/lwp";
// import { set, get } from "../../../utils/db.js";
import { openLink } from "../../../utils/dingtalk.js";

export default class Statistics extends Component {
  /* 
  * 暂时不用，请勿删除 20171012 Allan 
  **/

  // constructor(props) {
  //   super(props);
  //   this.state = {
  //     tipsShow: false
  //   };
  // }

  // componentWillMount() {
  //   if (get("isTipsShow")) {
  //     this.setState({
  //       tipsShow: false
  //     });
  //   } else {
  //     this.setState({
  //       tipsShow: true
  //     });
  //   }
  // }

  // openModal = () => {
  //   const { hrCenterInfo } = this.props;
  //   const _this = this;
  //   dd.device.notification.extendModal({
  //     cells: [
  //       {
  //         image:
  //           "https://gw.alicdn.com/tfs/TB1TJnCc2NNTKJjSspeXXaSwpXa-542-380.png",
  //         title: "建议启用人事审批模版",
  //         content: "建议启用人事审批模版，体验阿里巴巴一样的高效管理方式，移动办公处理面试、转正、调岗、离职无缝衔接，方便极速，规范有序！"
  //       }
  //     ],
  //     buttonLabels: ["查看详情", "一键启用"],
  //     onSuccess: function(result) {
  //       if (result.buttonIndex === 0) {
  //         window.location.href = `https://tms.dingtalk.com/markets/dingtalk/hrmobantuijian?corpId=${hrCenterInfo.corpId}`;
  //       } else {
  //         const data = [hrCenterInfo.corpId];
  //         lwp("/r/Adaptor/HRMCommonI/initAflowProcesses", { body: data })
  //           .then(res => {
  //             console.log("返回数据：", res);
  //             const responseText = JSON.parse(res.responseText);
  //             if (res.statusCode === 200 && responseText.length > 0) {
  //               var arr = [];
  //               for (var i = 0; i < responseText.length; i++) {
  //                 arr.push('"' + responseText[i].name + '"');
  //               }
  //               console.log(arr);
  //               const title = "成功启用" + responseText.length + "个钉钉推荐人事审批";
  //               const message =
  //                 "成功启用" +
  //                 arr.join() +
  //                 "建议停用旧有人事审批以免重复。停用方法：前往手机钉钉“工作->审批->添加/管理->停用”";
  //               dd.device.notification.alert({
  //                 message: message,
  //                 title: title,
  //                 buttonName: "我知道了",
  //                 onSuccess: function() {
  //                   _this.props.getInfo();
  //                 },
  //                 onFail: function(err) {
  //                   console.log(err, "失败");
  //                 }
  //               });
  //             } else if (res.statusCode === 200 && responseText.length === 0) {
  //               dd.device.notification.alert({
  //                 message: "如需设置请前往oa.dingtalk.com",
  //                 title: "已启用过人事审批",
  //                 buttonName: "我知道了"
  //               });
  //             }
  //           })
  //           .catch(err => {
  //             console.log(err);
  //           });
  //       }
  //     },
  //     onFail: function(err) {
  //       reject(err);
  //     }
  //   });
  // };

  // noShow = () => {
  //   set("isTipsShow", true);
  //   this.setState({
  //     tipsShow: false
  //   });
  // };

  toLink = url => {
    // console.log("toLink" + url);
    window.dd.biz.util.openLink({ url: url, enableShare: true });
  };

  link = (url, useOpenLink) => {
    // console.log("href" + url + "|useOpenLink:" + useOpenLink);
    if (useOpenLink) {
      this.toLink(url);
    } else {
      window.location.href = url;
    }
  };
  buildRosterStatic(hrCenterInfo) {
    return (
      <div
        className="employee-change"
        onClick={() => {
          openLink("#/onJobList");
        }}
      >
        <span className="roster-title">在职员工人数</span>
          {hrCenterInfo.totalOnJob}
          <span>人</span>
          <span>
            <Icon type="right" size="md" className="roster-arrow" />
          </span>
      </div>
    );
  }

  buildFlowItem(url, icon, name, useOpenLink) {
    return (
      <li
        className="menu-item"
        key={url}
        onClick={() => this.link(url, useOpenLink)}
      >
        <img src={icon} alt="" />
        <p>{name}</p>
      </li>
    );
  }

  buildNumberStatItem(url, number, text, useOpenLink) {
    return (
      <li
        className="menu-item"
        key={url}
        onClick={() => this.link(url, useOpenLink)}
      >
        <span> {number} </span>
        <p>{text}</p>
      </li>
    );
  }

  buildItemGroup(itemGroup, title) {
    if (!itemGroup || itemGroup.length === 0) {
      return null;
    }

    const itemList = [];

    itemGroup.map((item, index) => {
      if (item.count < 0) {
        itemList.push(
          this.buildFlowItem(
            item.url,
            item.icon,
            item.name,
            item.useOpenLink,
            index % 2 === 0
          )
        );
      } else {
        itemList.push(
          this.buildNumberStatItem(
            item.url,
            item.count,
            item.name,
            item.useOpenLink,
            index % 2 === 0
          )
        );
      }
    });

    return (
      <div className="employee-roster">
        <h4>{title}</h4>
        <ul>{itemList}</ul>
      </div>
    );
  }

  buildStatisticModule(hrCenterInfo) {
    if (!hrCenterInfo || !hrCenterInfo.processItemGroup) {
      return null;
    }

    return (
      <div>
        {/* 暂时不用，请勿删除 20171012 Allan */}
        {/* {hrCenterInfo.publishedFlag &&
          this.state.tipsShow && (
            <div className="hr-manage-wrap">
              <div className="start-use">
                <img src="https://gw.alicdn.com/tfs/TB1J_auhwoQMeJjy0FpXXcTxpXa-42-44.png" />
                <span>建议启用钉钉推荐人事审批模板</span>
                <span className="use-btn" onClick={() => this.openModal()}>
                  立即启用
                </span>
                <Icon
                  type="cross"
                  className="close"
                  onClick={() => this.noShow()}
                />
              </div>
            </div>
          )} */}

        {this.buildItemGroup(
          hrCenterInfo.processItemGroup.GROUP_HIRE, 
          "入职管理"
        )}
        <WhiteSpace size="lg" />
        {this.buildItemGroup(
          hrCenterInfo.processItemGroup.GROUP_DISMISSION,
          "离职管理"
        )}
        <WhiteSpace size="lg" />
        {this.buildItemGroup(
          hrCenterInfo.processItemGroup.GROUP_REGULAR,
          "转正管理"
        )}
        <WhiteSpace size="lg" />
        {this.buildItemGroup(
          hrCenterInfo.processItemGroup.GROUP_TRANSFER,
          "人事调动"
        )}
        <WhiteSpace size="lg" />
        {this.buildItemGroup(
          hrCenterInfo.processItemGroup.GROUP_ATTENDANCE,
          "假勤管理"
        )}
        <WhiteSpace size="lg" />
      </div>
    );
  }

  render() {
    const { hrCenterInfo, aflowUrl, attendUrl, className } = this.props;
    // const { processItems = [] } = hrCenterInfo;
    return (
      <div className={`employee-manage-wrap ${className}`}>
        {/* 在职员工花名册 */}
        {this.buildRosterStatic(hrCenterInfo)}
        <WhiteSpace size="lg" />
        {/* 其他动态获取的菜单模块 */}
        {this.buildStatisticModule(hrCenterInfo)}
      </div>
    );
  }
}
